import React, { Component } from 'react'

export const Check = () => {
    const imgUrl = {
        logoUrl: require('../../assets/img/login-img/logo-form-header.png'),
        logoPeopleUrl: require('../../assets/img/login-img/logo-people.png'),
        logoPlant: require('../../assets/img/login-img/green-plant.png'),
        logoIconQQ: require('../../assets/img/login-img/icon/QQ-line.png'),
        logoIconSine: require('../../assets/img/login-img/icon/sina-line.png'),
        logoIconChart: require('../../assets/img/login-img/icon/wx-line.png'),
        logoQQ: require('../../assets/img/login-img/icon/QQ.png'),
        logoSine: require('../../assets/img/login-img/icon/sina.png'),
        logoChart: require('../../assets/img/login-img/icon/wx.png'),
        logoCheckCw: require('../../assets/img/login-img/cw.png'),
    };
    return (
        <div class="box-bg">
            <div class="box">
                <img src={imgUrl.logoCheckCw} class="cuo" />
                <span class="top-s">身份验证</span>
                <span class="top-x">拖动滑块，使图片角度为正</span>
                <div id="rotateWrap1">
                    <div class="rotateverify-contaniner">
                        <div class="rotate-can-wrap">
                            <canvas class="rotateCan rotate-can" width="200" height="200"></canvas>
                            <div class="statusBg status-bg"></div>
                        </div>
                        <div class="control-wrap slideDragWrap">
                            <div class="control-tips">
                                <p class="c-tips-txt cTipsTxt">滑动将图片转正</p>
                            </div>
                            <div class="control-bor-wrap controlBorWrap"></div>
                            <div class="control-btn slideDragBtn">
                                <i class="control-btn-ico"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    )
}
